# Throwing Promises

<EpicVideo url="https://www.epicreact.dev/workshops/react-suspense/throwing-promises" />

👨‍💼 Right now the app is "working." This app displays information about space
ships from a fictional sci-fi universe. The app is using a `fetch` request to
get the data in the <InlineFile file="utils.tsx" /> file. That fetch request
gets routed (by the workshop app) through <InlineFile file="api.server.ts" />
which retrieves the data from `./shared/ship-api-utils.server.ts`.

The problem is that while the `fetch` request is ongoing, the user is just
staring at a blank white screen. Now we could for sure improve the HTML document
file a bit to have a loading state in HTML until the ship data shows up, but we
want to be able to manage transitions like this as the user navigates around as
well. Componentize all the things!

So for this first step, you're going to need to remove the `await` on the
`getShip` call and then if the `ship` data hasn't loaded yet, you'll throw the
`shipPromise`. You can also wrap the `<ShipDetails />` in a `<Suspense>`
boundary and render the `<ShipFallback />` component so we have a nicer loading
state.

Give that a whirl!
